<!-- saved from url=(0049)http://www.jq22.com/demo/jQueryHover201705041004/ -->
<html>

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

	<title>무제 문서</title>
	<style type="text/css">
		* {
			margin: 0;
			padding: 0;
		}

		a {
			color: #999;
			text-decoration: none;
		}

		li {
			list-style: none;
		}

		body {
			background-color: #222222;
		}

		.xs_ul {
			width: 1072px;
			margin: 100px auto 0;
			font-size: 0;
			line-height: 0;
		}

		.xs_ul li {
			display: inline-block;
			font-size: 20px;
			line-height: 20px;
			background: #fff;
			margin: 20px;
		}

		.xs_ul li a {
			display: block;
			width: 76px;
			text-align: center;
			padding: 15px 30px;
			border: 1px solid #000;
		}
	</style>
	<script src="./무제 문서_files/jquery-1.10.2.js"></script>
	<script src="./무제 문서_files/jquery.min.js"></script>
	<script type="text/javascript" src="./무제 문서_files/xs.js"></script>
</head>

<body>
	
		<ul class="xs_ul">
			<li class="xs_li_01" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果1</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_02" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果2</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_03" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果3</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_04" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果4</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_05" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果5</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_06" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果6</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_07" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果7</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_08" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果8</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_09" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果9</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_10" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果10</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_11" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果11</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_12" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果12</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_13" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果13</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_14" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果14</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_15" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果15</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_16" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果16</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_17" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果17</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_18" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果18</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_19" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果19</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_20" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果20</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_21" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果21</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_22" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果22</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_23" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果23</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_24" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果24</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_25" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果25</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_26" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果26</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_27" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果27</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_28" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果28</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_29" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果29</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
			<li class="xs_li_30" style="position: relative;">
				<a href="javascript:;" style="position: relative; z-index: 2;">效果30</a>
				<canvas width="138" height="52" style="position:absolute; top:0; left:0; z-index:1;"></canvas>
			</li>
		</ul>
	
	<script type="text/javascript">
		$(document).ready(function () {
			$(".xs_li_01").xs999(1);
			$(".xs_li_02").xs999(2);
			$(".xs_li_03").xs999(3);
			$(".xs_li_04").xs999(4);
			$(".xs_li_05").xs999(5);
			$(".xs_li_06").xs999(6);
			$(".xs_li_07").xs999(7);
			$(".xs_li_08").xs999(8);
			$(".xs_li_09").xs999(9);
			$(".xs_li_10").xs999(10);
			$(".xs_li_11").xs999(11);
			$(".xs_li_12").xs999(12);
			$(".xs_li_13").xs999(13);
			$(".xs_li_14").xs999(14);
			$(".xs_li_15").xs999(15);
			$(".xs_li_16").xs999(16);
			$(".xs_li_17").xs999(17);
			$(".xs_li_18").xs999(18);
			$(".xs_li_19").xs999(19);
			$(".xs_li_20").xs999(20);
			$(".xs_li_21").xs999(21);
			$(".xs_li_22").xs999(22);
			$(".xs_li_23").xs999(23);
			$(".xs_li_24").xs999(24, {
				color: '#6ce'
			});
			$(".xs_li_25").xs999(25);
			$(".xs_li_26").xs999(26);
			$(".xs_li_27").xs999(27);
			$(".xs_li_28").xs999(28);
			$(".xs_li_29").xs999(29);
			$(".xs_li_30").xs999(30);
		});
	</script>


</body>

</html>